<!DOCTYPE HTML>
<html>
  <body style="background-color: silver;">
    <p>For a draggable element that has padding, the drag image that is created
    should respect that background color. Note that none of the drag images
    use any of the body element's silver background.</p>

    <div style="position: absolute; top: 100px; padding: 50px; border: solid 2px black;" draggable="true">
      <div style="background-color: grey; width: 100px; height: 100px;">Drag me! Drag image padding should remain transparent.</div>
    </div>

    <div style="position: absolute; top: 350px; padding: 50px; border: solid 2px black; background-color: rgba(1, 0, 0, 0);" draggable="true">
      <div style="background-color: grey; width: 100px; height: 100px;">Drag me! Drag image padding should be transparent.</div>
    </div>

    <div style="position: absolute; top: 350px; left: 250px; padding: 50px; border: solid 2px black; background-color: white;" draggable="true">
      <div style="background-color: grey; width: 100px; height: 100px;">Drag me! Drag image padding should be white.</div>
    </div>

    <div style="position: absolute; top: 350px; left: 500px; padding: 50px; border: solid 2px black; background-color: lime;" draggable="true">
      <div style="background-color: grey; width: 100px; height: 100px;">Drag me! Drag image padding should be lime.</div>
    </div>

    <div style="position: absolute; top: 100px; left: 250px; width: 200px; height: 200px; background-color: cyan;"> Drag on top of me just for reference.</div>

  </body>
</html>
